const color = ['#2857f0','#e05a29','#e05a29','#fae3d2'];

let bannerTop = document.getElementById('banner-top');
let bannerContainer = document.getElementById('banner-container');
let bannerCircle = document.querySelectorAll('#banner-right-bottom > div');


let index = 0;
setInterval(() => {
    bannerTop.style.backgroundColor = color[index];
    bannerContainer.style.backgroundImage = `url(img/banner/carousel${index}.jpg)`;
    for(let i=0;i<4;i++){
        bannerCircle[i].classList.remove('active');
    }
    bannerCircle[index].classList.add('active');
    index++;
    if(index > 3) {
        index = 0;
    }
}, 3000);